<template>
  <!-- 统计报表-银保通问题清单报表页面 -->
  <div class="fillcontain">
    <!-- 标题 -->
    <div class="fastQuery">
      <el-row>
        <el-col :span="6" class="fastQuery_title">
          <i class="el-icon-tickets"></i><span>银保通银行录入问题件清单报表</span></el-col>
        <el-col :span="8"></el-col>
      </el-row>
    </div>
    <el-form :model="searchParams" :rules="rules" ref="ruleForm" label-width="100px" class="search_container">
            <el-row>
                <el-col :span="8">
                    <el-form-item label="统计时间" prop="idNo">
                        <el-date-picker
                        v-model="searchParams.beginAndEndDate"
                        type="daterange"
                        value-format="yyyyMMdd"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期">
                      </el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="机构" prop="idNo">
                        <el-select v-model="searchParams.organId" placeholder="" >
                          
                            <el-option key="" label="全部"
                                       value=""></el-option>
                          
                            <el-option v-for="item in ssyMap" :key="item.sorgid" :label="item.sorgname"
                                       :value="item.sorgid"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6" class="text_center">
                    <el-button type="primary" icon="el-icon-search" @click="getList(1)"></el-button>
                    <el-button type="primary" plain  icon="el-icon-refresh" @click="resetSearch"></el-button>
                </el-col>
            </el-row>
        </el-form>
    <div class="contain">
     <!-- 操作按钮 -->
        <el-row class="bgfff pb20"> 
          <el-col :span="24">
              <el-button @click="goExport" type="danger" plain>导出</el-button>
          </el-col>
        </el-row>
       <div class="table_container">
            <el-table
                 v-loading="loading"
                 :data="tableData"
                 highlight-current-row
                 header-cell-class-name="table-header-class"
                 
                 style="width:100%">
                 
                <el-table-column
                  type="index"
                    label="序号"
                  width="50">
                  <template scope="scope"><span>{{scope.$index+(paginations.pageIndex - 1) * paginations.pageSize + 1}} </span></template>
                </el-table-column>
                <el-table-column
                    min-width="120"
                   property="organName"
                   label="机构"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    min-width="120"
                   label="保单号码"
                   property="chdrnum"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column>
                 <el-table-column
                 min-width="120"
                   property="insurant"
                   label="被保险人"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                 min-width="120"
                   property="policyHolder"
                   label="投保人"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                 min-width="120"
                   property="effectDate"
                   label="生效日期"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                 min-width="120"
                   property="returnDate"
                   label="回销日期"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                 min-width="120"
                   property="bankNetAddress"
                   label="银行网点名称"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                 min-width="120"
                   property="clientCode"
                   label="客户经理代码"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                 min-width="120"
                   property="clientName"
                   label="客户经理姓名"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                 min-width="120"
                   property="chdrState"
                   label="保单状态"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                 min-width="120"
                   property="isModify"
                   label="是否修改"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                min-width="120"
                   property="describe"
                   label="中文描述"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                min-width="120"
                   property="epibolyValue"
                   label="银行录入值"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
                <el-table-column
                min-width="120"
                   property="caseno"
                   label="外包录入值"
                   align='center'
                   show-overflow-tooltip>
                </el-table-column> 
            </el-table>
                <el-row>
                    <el-col :span="24">
                        <div class="pagination">
                            <el-pagination background v-if='paginations.total > 0' :page-sizes="paginations.pageSizes" :page-size="paginations.pageSize"
                                :layout="paginations.layout" :total="paginations.total" :current-page='paginations.pageIndex'
                                @current-change='handleCurrentChange' @size-change='handleSizeChange'>
                            </el-pagination>
                        </div>
                    </el-col>
                </el-row>
        </div>
    </div>
  </div>
</template>
<script>
  import constant from '@/utils/constant';
    import request from '@/utils/axios';
    import{getBankInputListStatis} from '@/api/statis/report/report.js';
    
    import {getSsyOrgMap} from "@/api/taskCenter/taskCommon";
    import {getBeginAndEndOfCurrentMonth} from '@/utils/mUtils'
    import TaskConstants, {
        call,exportData
    } from "@/api/taskManager/common"
   export default {
        data(){
            return {
              expiryDate:'',
              ssyMap:[],
              tableData:[],
              searchParams:{
                  beginAndEndDate:'',
                  organId:''
              },
              
                paginations: {
                    total: 0,        // 总数
                    pageIndex: 1,  // 当前位于哪页
                    pageSize: 10,   // 1页显示多少条
                    pageSizes: [5, 10, 15, 20],  //每页显示多少条
                    layout: "total, sizes, prev, pager, next, jumper"   // 翻页属性
                },
            }
        },
        methods:{
            // 上下分页
            handleCurrentChange(page) {
                this.paginations.pageIndex = page;
                this.getList();
            },
            // 每页多少条切换
            handleSizeChange(pageSize) {
                this.paginations.pageSize = pageSize;
                this.getList();
            },
            getList(){
                console.log(this.searchParams)
                if(page){
                    this.paginations.pageIndex=page;
                }
                if(this.searchParams.beginAndEndDate==null||this.searchParams.beginAndEndDate.length!=2){
                      this.$message({
                        type: 'error',
                        message: '请选择起止时间'
                      });
                    return;
                }
                if(this.searchParams.beginAndEndDate[1].slice(0,4)-this.searchParams.beginAndEndDate[0].slice(0,4)>=1){
                      this.$message({
                        type: 'error',
                        message: '不支持跨年查询'
                      });
                    return;
                }
                let params = {
                  beginDate:this.searchParams.beginAndEndDate[0],
                  endDate:this.searchParams.beginAndEndDate[1],
                  organId:this.searchParams.organId,
                  pageSize: this.paginations.pageSize,
                  pageNumber: this.paginations.pageIndex
                }
                this.$store.dispatch('loading/CHNAGE_SUBLOADING', true)
                getBankInputListStatis(params).then(res => {
                  this.$store.dispatch('loading/CHNAGE_SUBLOADING', false)
                  if (res.resultCode == constant.SUCCESS && res.data) {
                    this.tableData = res.data.list;
                    this.paginations.total = res.data.total;
                  }
                }).catch(err => {
                  this.$store.dispatch('loading/CHNAGE_SUBLOADING', false)
                })
            },
            goExport(){
                var url='/ilmp/task-app/bank/report/input/export?beginDate='+this.searchParams.beginAndEndDate[0]+'&endDate='+this.searchParams.beginAndEndDate[1]+'&organId='+this.searchParams.organId
                var reportCSS = "toolbar=no,status=no,menubar=no,location=no,resizable=yes,";
                    reportCSS+= "directories=no,scrollbars=yes,copyhistory=yesm,width=800,height=600";
                    
//                  url='/ilmp/task-app/bank/report/inputAnalysis/queryData'
                    
              let obj={}
                obj.beginDate=this.searchParams.beginAndEndDate[0];
                obj.endDate=this.searchParams.beginAndEndDate[1];
                obj.organId=this.searchParams.organId;
                let vueObj = this;
                exportData(vueObj,TaskConstants.apis.input, obj, "post","银保通银行录入问题件清单报表.xls","application/vnd.ms-excel;charset=utf-8");
            
            },
            resetSearch(){
                this.searchParams.beginAndEndDate=getBeginAndEndOfCurrentMonth();
                this.searchParams.organId='';
            }
        },
        created(){
            this.searchParams.beginAndEndDate=getBeginAndEndOfCurrentMonth();
            getSsyOrgMap().then(data => this.ssyMap = data);
        },
        activated(){
            document.onkeydown = (event)=>{
                  var e = event || window.event || arguments.callee.caller.arguments[0];
                  if (e && e.keyCode == 113) {
                      this.getList();
                  }
              };
        }
   }
</script>
<style lang="less" scoped>
  .fillcontain {
    padding-bottom: 0;
    .fastQuery {
      padding: 15px 20px 10px 20px;
      background: #fff;
      border-bottom: 1px solid #e1e1e1;

      .fastQuery_title {
        color: #666;
        padding: 6px 0px;
      }
    }
  }

  .contain {
    background: #fff;
    padding: 10px;
    margin-bottom: 20px;
  }


</style>